<script setup lang="ts">
  import { ref } from 'vue'
  import { onLoad } from '@dcloudio/uni-app'
  import { showMessage } from '@/api/user'
  const notionInfo = ref({
    title:undefined,
    createdTime:undefined,
    content:undefined,
  })
  onLoad((option:any) => {
    showMessage({id:option.id}).then(res => {
      notionInfo.value = res.data
    })
  })
</script>

<template>
  <xx-title title="消息详情"/>
  <view class="notification-body">
    <view class="title">{{notionInfo.title}}</view>
    <view class="time">{{notionInfo.createdTime}}</view>
    <view class="content">{{notionInfo.content}}</view>
  </view>
</template>

<style scoped lang="scss">
  .notification-body{
    padding: 20rpx;
    .title{
      font-size: 32rpx;
      font-weight: 500;
      color: #222222;
    }
    .time{
      font-size: 26rpx;
      display: inline-block;
      border-radius: 32rpx;
      box-sizing: border-box;
      margin: 20rpx 0;
    }
    .content{
      font-size: 28rpx;
      line-height: 1.8;
      color: #505363;
    }
  }
</style>
